
$(function(){
	loadHeader();//加载汇总数据
    showRealTimeFullLoad();//线路客流实时满载率
    fullLoadTrend();//重点线路满载变化趋势（TOP5）
    drawSectionRank();//区间满载率排名（TOP5）
    showPeakFullload();
    showTopFullloadSection();
});

function loadHeader(){
	$.ajax({
        type: "post",
        url: "fullload/loadHeader",
        dataType: "json",
        success: function (data) {
        	if(data.length>0){
        		
        		$("#lineCount").html(data[0].lineCount);
        		$("#sectionCount").html(data[0].sectionCount);
        		$("#largeHundred").html(data[0].largeHundred);
        		$("#largeFifty").html(data[0].largeFifty);
        	}
    	}
    });
}

function showRealTimeFullLoad(){
	var bgStr="";
    $.ajax({
        type: "post",
        url: "fullload/realTimeFullLoad",
        dataType: "json",
        success: function (data) {
        	$("#realTimeFullLoad").html("");
        	if(data.length>0){
        		$("#statisticDate").html(data[0].statisticDate);
        		for(var i in data){
        			
            		bgStr+="<tr><td style='color:"+data[i].lineColor+";'>"+data[i].lineName+"</td>";
            		bgStr+="<td>"+data[i].timeSection+"</td>";
            		bgStr+="<td>"+(data[i].saturation*100).toFixed(2)+"%</td>";
            		bgStr+="<td>"+"<button type='button' class='btn btn-info' onclick='toFullloadDetail("+data[i].lineId+")'>查看</button></td></tr>";
    			}
        		$("#realTimeFullLoad").html(bgStr);
        	}
    	}
    });
}

function toFullloadDetail(lineId){
	window.location.href="fullloadDetail?lineId="+lineId;
}

//实时重点线路变化趋势
function fullLoadTrend(){
	var timeSectionEndDate = new Date();
	var m = timeSectionEndDate.getMinutes();
	m = Math.floor(m/5)*5;
	timeSectionEndDate.setMinutes(m);
	timeSectionEndDate.setSeconds(0);
	
	var startLongTime = timeSectionEndDate.getTime()-1000*60*55;
	
	
	$.ajax({
        type: "post",
        url: "fullload/fullLoadTrend",
        dataType: "json",
        data :{conditionStartDate : new Date(startLongTime).format("yyyy-MM-dd hh:mm:ss"),conditionEndDate :timeSectionEndDate.format("yyyy-MM-dd hh:mm:ss")},
        success: function (data) {
        	drawTrendChart(data);
    	}
    });
}

//历史终点线路变化趋势
function fullLoadTrendHis(){
	var day = new Date();
	day.setTime(day.getTime()-24*60*60*1000);
	var conditionDateStr = day.format("yyyy-MM-dd");
	
	$.ajax({
        type: "post",
        url: "fullload/fullLoadTrendHis",
        dataType: "json",
        data :{conditionDate:conditionDateStr},
        success: function (data) {
        	drawTrendChart(data);
    	}
    });
}

function drawTrendChart(data){
	var colorList = ["#D8281E","#87B848","#256FB8","#9DD1D8","#CAADD2"];
	var dataX = [];
	var dataY1 = [];
	var dataY2 = [];
	var dataY3 = [];
	var dataY4 = [];
	var dataY5 = [];
	
	var myChart = echarts.init(document.getElementById('mains_one'));
	
	for(var i in data){
		if(data[i].lineId == '1'){
			dataX.push(data[i].timeSection);
			dataY1.push((data[i].saturation*100).toFixed(2));
		}
		if(data[i].lineId == '2'){
			dataY2.push((data[i].saturation*100).toFixed(2));
		}
		if(data[i].lineId == '8'){
			dataY3.push((data[i].saturation*100).toFixed(2));
		}
		if(data[i].lineId == '9'){
			dataY4.push((data[i].saturation*100).toFixed(2));
		}
		if(data[i].lineId == '10'){
			dataY5.push((data[i].saturation*100).toFixed(2));
		}
	}
	var option = {
		    tooltip: {
		        trigger: 'axis',
		        formatter:function(param){
		        	var tooltipStr = param[0].name+"<br>";
		        	for(var p in param){
		        		tooltipStr+=param[p].marker+" " + param[p].seriesName+"："+param[p].value+"%<br>";
		        	}
					return tooltipStr;
		        }
		    },
		    legend: [
		    	{
		            x:'center',
		            data: ['1号线', '2号线','8号线']
		        },
		        {
		            x:'center',
		            top:'8%',
		            data: ['9号线','10号线']
		        }
		    ],
		    
		    grid:{
		    	top:'16%',
		        left: '15%',  
				right: '12%', 
		    },
		    xAxis: {
		    	name:"时间",
		        data: dataX,
		        axisLine: {
		            lineStyle: {
		                color: 'black'
		            }
		        },
		        axisTick:{
		            show:false,
		        },
//		        axisLabel:{
//		        	interval: 0,//强制显示所有标签
//		        	fontSize:8
//		        },
		    },
		    yAxis: {
		    	name:"满载率",
		        splitLine: {
		        	show: true,
		        	type:'dashed'    //设置网格线类型 dotted：虚线   solid:实线
	        	},
		        axisLine: {
		            lineStyle: {
		                color: 'black',
		            }
		        },
		        axisLabel:{
		        	formatter:'{value}%',
		        }
	    	},
		    
		    series: [
		    	{
		        name: '1号线',
		        type: 'line',
		        smooth: true,
		        showAllSymbol: true,
		        symbol: 'emptyCircle',
		        symbolSize: 8,
		        color : colorList[0],
		        itemStyle: {
		                normal: {
		                	label: {
		                        show: false,
		                        position: "top",
		                        formatter: function(params){
		                            return params.value+'%';
		                        }
		                    }
	                	},
		        },
		        data: dataY1
		    },
		    {
		        name: '2号线',
		        type: 'line',
		        smooth: true,
		        showAllSymbol: true,
		        symbol: 'emptyCircle',
		        symbolSize: 8,
		        color : colorList[1],
		        itemStyle: {
		                normal: {
		                	label: {
		                        show: false,
		                        position: "top",
		                        formatter: function(params){
		                            return params.value+'%';
		                        }
		                    }
	                	},
		        },
		        data: dataY2
		    },
		    {
		        name: '8号线',
		        type: 'line',
		        smooth: true,
		        showAllSymbol: true,
		        symbol: 'emptyCircle',
		        symbolSize: 8,
		        color : colorList[2],
		        itemStyle: {
		                normal: {
		                	label: {
		                        show: false,
		                        position: "top",
		                        formatter: function(params){
		                            return params.value+'%';
		                        }
		                    }
	                	},
		        },
		        data: dataY3
		    },
		    {
		        name: '9号线',
		        type: 'line',
		        smooth: true,
		        showAllSymbol: true,
		        symbol: 'emptyCircle',
		        symbolSize: 8,
		        color : colorList[3],
		        itemStyle: {
		                normal: {
		                	label: {
		                        show: false,
		                        position: "top",
		                        formatter: function(params){
		                            return params.value+'%';
		                        }
		                    }
	                	},
		        },
		        data: dataY4
		    },
		    {
		        name: '10号线',
		        type: 'line',
		        smooth: true,
		        showAllSymbol: true,
		        symbol: 'emptyCircle',
		        symbolSize: 8,
		        color : colorList[4],
		        itemStyle: {
		                normal: {
		                	label: {
		                        show: false,
		                        position: "top",
		                        formatter: function(params){
		                            return params.value+'%';
		                        }
		                    }
	                	},
		        },
		        data: dataY5
		    },
		   ]
		};
	myChart.setOption(option);
}

function drawSectionRank(){
	var myChart = echarts.init(document.getElementById('sectionRank'));
	var colorList = ["#E6171C","#8BBF45","#F2D12F","#B699C4","#333366"];
	
	var dataX = [];
	var dataY = [];//累计人数
	$.ajax({
        type: "post",
        url: "fullload/sectionRank",
        dataType: "json",
        success: function (data) {
        	for(var i in data){
        		dataX.push(data[i].lineName+'-'+data[i].sectionName);
        		dataY.push({lineColor:data[i].lineColor,value:(data[i].saturation*100).toFixed(2)});
			}
        	var option = {
        			title: {
        		        x: 'center',
        		        y: 0,
        		        textStyle:{
        		            color:'#B4B4B4',
        		            fontSize:13,
        		            fontWeight:'normal',
        		        },
        		        
        		    },
        		    tooltip: {
        		        trigger: 'axis',
        		        formatter:function(param){
        		        	var tooltipStr = "";
        		        	for(var i=0;i<param[0].name.split("-").length;i++){
        		        		tooltipStr += param[0].name.split("-")[i]+"<br>";
        		        	}
	    		        	for(var p in param){
	    		        		tooltipStr+=param[p].marker+" " + param[p].seriesName+"："+param[p].value+"%<br>";
	    		        	}
	    		        	return tooltipStr;
        		        }
        		    },
        			grid:{
        				top :'10%',
        				left: '18%',  
        				right: '15%',  
        		    },
        		    yAxis: [
        		        {
        		        	name:"区间",
        		        	data: dataX,
        		        	axisLine: {
        			            lineStyle: {
        			                color: 'black'
        			            }
        			        },
        			        axisLabel:{
        			        	interval: 0,//强制显示所有标签
        			        	align: 'center',
        			        	margin : '34',
        			        	formatter:function(params) {
        			        		var paramsArray = params.split("-");
        			        		return paramsArray[0]+"\n"+paramsArray[1]+"\n"+paramsArray[2];
        			        	},
        			        	fontSize:9
        			        },
        			        axisTick:{
        			            show:false,
        			        },
        		            
        		        }
        		    ],
        		    xAxis: {
        		    	name:"满载率",
        		    	splitLine: {show: false},
        		        axisLine: {
        		            lineStyle: {
        		                color: 'black',
        		            }
        		        },
        		        axisLabel:{
        		            formatter:'{value}%',
        		        },
        		        splitLine :{    //网格线
	        		        lineStyle:{
	        		            type:'dashed'    //设置网格线类型 dotted：虚线   solid:实线
	        		        },
	        		        show:true //隐藏或显示
        		        }

        	    	},
        		    series: [
        		        {
        		            name:'满载率',
        		            type:'bar',
        		            barWidth: 10,
        		            itemStyle: {
        		                normal: {
        		                    barBorderRadius: 5,
        		                    color: function(params){
        		                    	return params.data.lineColor;
        		                    },
        		                    fontSize:1
        		                }
        		            },
        		            data:dataY
        		        }
        		    ]
        		};
        	myChart.setOption(option);
    	}
    });
}

function showPeakFullload(){
	var bgStr="";
	
	var day = new Date();
	day.setTime(day.getTime()-24*60*60*1000);
	var conditionDateStr = day.format("yyyy-MM-dd");
	
    $.ajax({
        type: "post",
        url: "fullload/loadPeakFullload",
        dataType: "json",
        data :{conditionDate:conditionDateStr},
        success: function (data) {
        	$("#peakFullload").html("");
        	if(data.length>0){
        		for(var i in data){
            		bgStr+="<tr><td>"+data[i].lineName+"</td>";
            		bgStr+="<td>"+(data[i].avgSaturation)+"%</td></tr>";
    			}
    			$("#peakFullload").html(bgStr);
        	}
        	
    	}
    });
}

function showTopFullloadSection(){
	var bgStr="";
	
	var day = new Date();
	day.setTime(day.getTime()-24*60*60*1000);
	var conditionDateStr = day.format("yyyy-MM-dd");
	
    $.ajax({
        type: "post",
        url: "fullload/loadTopFullloadSection",
        dataType: "json",
        data :{conditionDate:conditionDateStr},
        success: function (data) {
        	$("#topFullloadSection").html("");
        	if(data.length>0){
	        	for(var i in data){
	        		bgStr+="<tr><td style='vertical-align:middle;'>"+data[i].lineName+"</td>";
	        		bgStr+="<td style='vertical-align:middle;'>"+data[i].sectionName.replace("==>", "<br/>")+"</td>";
	        		bgStr+="<td style='vertical-align:middle;'>"+data[i].timeSection+"</td>";
	        		bgStr+="<td style='vertical-align:middle;'>"+(data[i].saturation)+"%</td></tr>";
				}
				$("#topFullloadSection").html(bgStr);
        	}
    	}
    });
}
